<%--
  Created by IntelliJ IDEA.
  User: YYY-Work
  Date: 2017/7/17
  Time: 9:36
  To change this template use File | Settings | File Templates.
--%>
<%@ page language="java" contentType="text/html; charset=UTF-8"
         pageEncoding="UTF-8" %>
<%@ taglib prefix="s" uri="/struts-tags" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%
    String path = request.getContextPath();
    String basePath = request.getScheme() + "://"
            + request.getServerName() + ":" + request.getServerPort()
            + path;
%>
<!DOCTYPE>
<html>
<head>
    <title>音频专题详情</title>
    <meta charset="UTF-8">
    <title>AdminLTE | Data Tables</title>
    <meta content='width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no' name='viewport'>

    <!-- start分页需要使用以下三个js -->
    <script type="text/javascript" src="<%=basePath%>/js/jquery-2.1.1.min.js"></script>
    <!-- end分页需要使用以上三个js -->

    <style type="text/css">
        .table th, .table td {
            text-align: center;
            vertical-align: middle !important;
        }
    </style>
</head>
<body class="skin-blue">
<!-- header logo: style can be found in header.less -->


<!-- getHeader -->
<s:action name="getHeader" namespace="/privilege" executeResult="true"/>
<div class="wrapper row-offcanvas row-offcanvas-left">
    <!-- Left side column. contains the logo and sidebar -->

    <!-- getMenus -->
    <s:action name="getMenus" namespace="/privilege" executeResult="true"/>

    <!-- Right side column. Contains the navbar and content of the page -->
    <aside class="right-side">
        <!-- Content Header (Page header) -->
        <section class="content-header">
            <h1>
                <small>音频专题管理</small>
            </h1>
        </section>

        <!-- Main content -->
        <section class="content">
            <div class="row">
                <div class="col-xs-12">
                    <div class="box">

                        <div class="box box-danger">

                            <div class="box-body">

                                <form class="form-horizontal" id="updataSubjectForm">
                                    <input id="recid" name="recid" style="display: none" value="${voiceOnDemond.recid}">
                                    <div class="form-group">
                                        <lable class="col-sm-1" style="text-align: right">频道名称</lable>
                                        <div class="col-sm-2">
                                            <input type="text" id="data_name" name="dataName" class="form-control"
                                                   value="${voiceOnDemond.dataName}">
                                        </div>
                                    </div>

                                    <div class="form-group">
                                        <lable class="col-sm-1" style="text-align: right">频道描述</lable>
                                        <div class="col-sm-4">
                                            <textarea type="text" id="data_desc" name="dataDesc" rows='4'
                                                      class="form-control" style="width: 100%">
                                                ${voiceOnDemond.dataDesc}
                                            </textarea>
                                        </div>
                                    </div>

                                    <div class="form-group">
                                        <lable class="col-sm-1" style="text-align: right">频道图片</lable>

                                        <div class="col-sm-4">
                                            <input type="file" id="img_url" name="imgUrlImage"/>
                                        </div>

                                    </div>

                                    <div class="form-group">
                                        <lable class="col-sm-1" style="text-align: right">是否免费</lable>
                                        <div class="col-sm-2">
                                            <select class="form-control" id="freetype" name="freetype">
                                                <option value="0">免费</option>
                                                <option value="1">会员专享</option>
                                            </select>
                                        </div>
                                    </div>

                                    <div class="form-group">
                                        <lable class="col-sm-1" style="text-align: right">是否可见</lable>
                                        <div class="col-sm-2">
                                            <select class="form-control" id="isIssueFlag" name="isIssueFlag">
                                                <option value="1">可见</option>
                                                <option value="2">不可见</option>
                                            </select>
                                        </div>
                                    </div>

                                    <div class="form-group">
                                        <lable class="col-sm-1" style="text-align: right">频道医生</lable>
                                        <div class="col-sm-2">
                                            <div id="stuff_name">

                                                <c:if test="${not empty voiceOnDemond.stuffName}">
                                                    <label>${voiceOnDemond.stuffName}</label>
                                                </c:if>
                                            </div>

                                            <input id="stuff_id" name="stuffId" style="display: none"
                                                   value="${voiceOnDemond.stuffId}"/>
                                            <input id="stuff_name_input" name="stuffName" style="display: none"
                                                   value="${voiceOnDemond.stuffName}"/>
                                            <div id="stuff_img">

                                            </div>

                                            <div>
                                                <button class="btn btn-success btn-xs" onclick="selectDoctor()"
                                                        type="button">
                                                    选择
                                                </button>
                                                <button class="btn btn-danger btn-xs" onclick="removeSelectDoctor()"
                                                        type="button">
                                                    移除
                                                </button>
                                            </div>

                                        </div>
                                    </div>


                                    <div class="form-group">
                                        <lable class="col-sm-1" style="text-align: right"></lable>
                                        <div class="col-sm-2">
                                            <a href="<%=basePath%>/voice/getVoiceSubjectDataList.action?voiceOnDemondId=${voiceOnDemond.recid}"
                                               class="btn btn-info">
                                                查看音频列表
                                            </a>
                                            <button type="button" class="btn btn-primary"
                                                    onclick="updataVoiceSubject()">保存
                                            </button>
                                        </div>

                                    </div>

                                </form>
                                <input id="d_recid" style="display: none"/>
                            </div><!-- /.box-body -->
                        </div><!-- /.box -->

                    </div><!-- /.box -->


                </div>
            </div>

        </section><!-- /.content -->
    </aside><!-- /.right-side -->
</div><!-- ./wrapper -->

<div class="modal fade" id="deleteAlertModal" tabindex="-1" role="dialog" aria-labelledby="messageModalLabel"
     aria-hidden="true">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <h4 class="modal-title">
                    操作提示
                </h4>
            </div>
            <div class="modal-body">
                <label id="d_dataName"/>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-danger" onclick="deleteVoiceData()" data-dismiss="modal">确定
                </button>
                <button type="button" class="btn btn-primary" data-dismiss="modal">取消
                </button>
            </div>
        </div><!-- /.modal-content -->
    </div><!-- /.modal -->
</div>

<div class="modal fade" id="selectDoctorModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel"
     aria-hidden="true">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <h4 class="modal-title">添加医生</h4>
                <div style="margin-top: 15px;vertical-align: middle;">
                    <form id="search-doctor-form">
                        <input type="text" id="stuff_search_name" name="stuffName" class="col-sm-3"
                               style="padding-top: 3px;padding-bottom: 3px" placeholder="请输入医生姓名">
                        <input name="currentPage" type="text" value="1" style="display: none">
                        <input name="pageSize" type="text" value="100" style="display: none">
                    </form>
                    <button type="button" class="btn btn-primary btn-sm" style="margin-left: 15px"
                            onclick="searchStuff()">查询
                    </button>
                </div>
            </div>
            <div class="modal-body" id="doctor-list" style="height: 400px;max-height:400px;overflow:scroll">

            </div>
            <div class="modal-footer">

                <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
            </div>
        </div><!-- /.modal-content -->
    </div><!-- /.modal -->
</div>


</body>

<script type="text/javascript" src="<%=basePath%>/js/admin/utils.js"></script>
<script type="text/javascript" src="<%=basePath%>/js/base/listtable.js"></script>
<link href="<%=basePath%>/css/fileinput.css" media="all" rel="stylesheet" type="text/css"/>
<link href="<%=basePath%>/themes/explorer/theme.css" media="all" rel="stylesheet" type="text/css"/>
<script src="<%=basePath%>/js/sortable.js" type="text/javascript"></script>
<script src="<%=basePath%>/js/fileinput.js" type="text/javascript"></script>
<script src="<%=basePath%>/js/locales/zh.js" type="text/javascript"></script>
<script src="<%=basePath%>/themes/explorer/theme.js" type="text/javascript"></script>


<script type="text/javascript">

    if (Utils.isEmpty('${voiceOnDemond.fullImgUrl}')) {
        $("#img_url").fileinput({
            language: 'zh', //设置语言 
            showUpload: false, //是否显示上传按钮  
            showCaption: true,//是否显示标题  
            maxFileCount: 1,
            allowedPreviewTypes: ['image'],
            allowedFileTypes: ['image'],
            allowedFileExtensions: ['jpg', 'png'],
        });
    } else {
        $("#img_url").fileinput({
            language: 'zh', //设置语言 
            showUpload: false, //是否显示上传按钮  
            showCaption: true,//是否显示标题  
            maxFileCount: 1,
            allowedPreviewTypes: ['image'],
            allowedFileTypes: ['image'],
            allowedFileExtensions: ['jpg', 'png'],
            showPreview: true,
            initialPreviewConfig: [{width: '250px'}],
            initialPreview: [
                "<img src='${voiceOnDemond.fullImgUrl}' class='file-preview-image' style=' width:250px;height:250px'/>",
            ],
        });
    }
    $("#freetype").val('${voiceOnDemond.freetype}');
    $("#isIssueFlag").val('${voiceOnDemond.isIssueFlag}');

    <!-- 更新音频专题信息 -->
    function updataVoiceSubject() {
        var formData = new FormData($('#updataSubjectForm')[0]);//
        $('#AddVoiceModal').modal('hide');
        $.ajax({
            type: "POST",
            url: "<%=basePath%>/voice/ajaxUpdataVoiceSubject.action",
            data: formData,
            async: false,
            contentType: false,
            processData: false,
            error: function (request) {
                alert("网络异常");
            },
            success: function (data) {
                alert("修改成功");
            }
        });

    }

    function searchStuff() {
        var formData = new FormData($('#search-doctor-form')[0]);//
        $.ajax({
            type: "POST",
            url: "<%=basePath%>/stuff/ajaxQueryStuffForSelect.action",
            data: formData,
            async: false,
            contentType: false,
            processData: false,
            error: function (request) {
                alert("网络异常");
            },
            success: function (data) {
                data = JSON.parse(data);
                if (!Utils.isEmpty(data.content)) {
                    $("#doctor-list").empty();
                    $("#doctor-list").append(data.content);
                }
            }
        });
    }

    function selectDoctor() {
        $("#selectDoctorModal").modal('show');
    }

    function onStuffSelect(stuffid, stuffName, iconUrl) {

        $("#stuff_name").empty();
        $("#stuff_name").append("<label name='stuffName'>" + stuffName + "</label>");

        $("#stuff_id").val(stuffid);
        $("#stuff_name_input").val(stuffName);
        $("#selectDoctorModal").modal('hide');

    }

    function removeSelectDoctor() {
        $("#stuff_name").empty();
        $("#stuff_img").empty();
        $("#stuff_id").val("");
        $("#stuff_name_input").val("");
    }

</script>
</html>
